<!--  -->
<template>
  <div class='configDetail'>
    <div class='configDetail_cityName'>
      城市：{{$route.query.title}}
    </div>
    <div class="configDetail_openplatform">
      <h3 class="configDetail_openplatform_h3">开放平台：</h3>
      <Checkbox @on-change="checkboxChange('bappStatus')"
        class="configDetail_openplatform_span" v-model="formValidate.bappStatus">B-APP
      </Checkbox>
      <Checkbox @on-change="checkboxChange('cappStatus')"
        class="configDetail_openplatform_span" v-model="formValidate.cappStatus">C-APP
      </Checkbox>
      <Checkbox @on-change="checkboxChange('pcStatus')" class="configDetail_openplatform_span"
        v-model="formValidate.pcStatus">C-PC</Checkbox>
      <Checkbox @on-change="checkboxChange('mstationStatus')"
        class="configDetail_openplatform_span" v-model="formValidate.mstationStatus">C-M站
      </Checkbox>
      <Checkbox @on-change="checkboxChange('wechatStatus')"
        class="configDetail_openplatform_span" v-model="formValidate.wechatStatus">C-小程序
      </Checkbox>
    </div>
    <Tabs :animated="false" @on-click="tableClick" :value="currentTab" type="card">
      <TabPane name="region" label="区域">
        <cityConfig-region v-if="currentTab == 'region'" />
      </TabPane>
      <TabPane name="area" label="板块">
        <cityConfig-area v-if="currentTab == 'area'" />
      </TabPane>
      <TabPane name="traffic" label="交通">
        <cityConfig-traffic v-if="currentTab == 'traffic'" />
      </TabPane>
      <TabPane name="screen" label="筛选">
        <cityConfig-screen v-if="currentTab == 'screen'" />
      </TabPane>
      <TabPane name="label" label="后台标签">
        <cityConfig-label v-if="currentTab == 'label'" />
      </TabPane>
    </Tabs>
  </div>
</template>

<script>
  import cityConfigRegion from "@/components/cityConfiguration/cityConfig_region.vue"
  import cityConfigArea from "@/components/cityConfiguration/cityConfig_area"
  import cityConfigLabel from "@/components/cityConfiguration/cityConfig_label"
  import cityConfigScreen from "@/components/cityConfiguration/cityConfig_screen"
  import cityConfigTraffic from "@/components/cityConfiguration/cityConfig_traffic"


  import generalConfiguration from '@/biz/generalConfiguration/generalConfiguration'
  export default {
    components: {
      cityConfigArea,
      cityConfigLabel,
      cityConfigScreen,
      cityConfigTraffic,
      cityConfigRegion
    },
    data() {
      return {
        formValidate: {},
        currentTab: 'region'
      };
    },
    computed: {},
    watch: {},
    methods: {
      checkboxChange(type) {
        console.log(this.formValidate)
        let params = {
          onlineCityId: this.$route.query.onlineCityId
        };
        params[type] = this.formValidate[type] ? 1 : 2;
        generalConfiguration.onlineCityUpdate(params).then(res => {
          this.$Message.success("修改成功")
        })
      },
      tableClick(e) {
        this.currentTab = e;
      }
    },
    created() {
      let arr = ['bappStatus', 'cappStatus', 'pcStatus', 'mstationStatus', 'wechatStatus'];
      let status = this.$route.query.status + "";
      status && (status = status.split("~"));
      Array.isArray(status) && status.forEach(item => this.formValidate[arr[item - 0]] = true)
    },
    mounted() {

    },
  }
</script>
<style lang='scss' scoped>
  .configDetail {
    padding: 20px;

    &_cityName {
      font-size: 16px;
      font-weight: 700;
      margin-bottom: 20px;
    }

    &_openplatform {
      &_h3 {
        display: inline-block;
        margin-bottom: 20px;
      }

      &_span {
        margin-left: 20px;
      }
    }
  }
</style>